<template>
  <div class="foot" :style="{ background: bgc }">
    <span>{{ span1 }}</span>
    <span>{{ span2 }}</span>
    <span>{{ span3 }}</span>
    <span>{{ span4 }}</span>
  </div>
</template>
<script>
export default {
  name: '',
  props: {
    span1: {
      type: String,
      default: '首页'
    },
    span2: {
      type: String,
      default: '店铺'
    },
    span3: {
      type: String,
      default: '旅游'
    },
    span4: {
      type: String,
      default: '我的'
    },
    bgc: {
      type: String,
    },

  },
  data () {
    return {

    }
  },
  created () {
  },
  computed: {
  },
  methods: {
  }
}
</script>
<style lang='less'  scoped>
.foot {
  // position: fixed;
  // left: 0;
  // bottom: 0;
  width: 100%;
  height: 80px;
  display: flex;
  justify-content: space-around;
  align-items: center;
  background-color: skyblue;
  span {
    cursor: pointer;
  }
}
</style>
